@charset "UTF-8";

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "微软雅黑";
}

html,body{
    font-size: 20px;
    width: 100%;
    height: 100%;
    background: #F5F5F5;
}


//个人用户
.user{
    width: 100%;
    height: 9.9rem;
    background: url(../img/bg.png) no-repeat;
    background-size: 100% 100%;
    .logo{
        width: 100%;
        text-align: center;
        a{
            img{
                width: 3.9rem;
                height: 3.9rem;
                margin-top: 2.25rem;
            }
        }
    }
    .personal{
        width: 5.7rem;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        margin-top: 0.7rem;
        span{
            color: #FFFFFF;
            font-size: 0.45rem;
            margin-right: 0.2rem;
        }
        a{
            text-decoration: none;
            div{
                font-size: 0.45rem;
                color: #FFFFFF;
                text-align: center;
                width: 3.3rem;
                height: 0.8rem;
                line-height: 0.8rem;
                background: #FFC802;
                border-radius: 4px;
                img{
                    width: 0.35rem;
                    height: 0.5rem;
                }
            }
        }
    }
}


//账户共计应用
.account{
    width: 100%;
    height: 5rem;
    background: #FFFFFF;
    padding: 0.85rem 0.375rem 0.35rem 0.7rem;
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid #E6E6E6;
    .account-l{
        p{
            color: #B2B2B2;
            &:first-child{
                font-size: 0.5rem;
            }
            &:last-child{
                font-size: 0.45rem;
                margin-top: 0.7rem;
                span{
                    color: #FA5B08;
                    font-size: 1.45rem;
                }
            }
        }
    }
    .account-r{
        p{
            color: #B2B2B2;
            font-size: 0.5rem;
        }
        img{
            width: 8.15rem;
            height: 2.65rem;
            margin-top: 0.4rem;
        }
    }
}

//应用信息
.message{
    width: 100%;
    padding-left: 0.7rem;
    margin-top: 0.6rem;
    background: #FFFFFF;
    border-top: 2px solid #E7E7E7;
    border-bottom: 2px solid #E7E7E7;
    ul{
        list-style: none;
        li{
            width: 100%;
            height: 1.875rem;
            line-height: 1.875rem;
            display: flex;
            justify-content: space-between;
            &:last-child{
                .message-r{
                    border: none;
                }
            }
            .message-l{
                img{
                    width: 1.1rem;
                    height: 1.1rem;
                }
            }
            .message-r{
                width: 12.75rem;
                display: flex;
                justify-content: space-between;
                border-bottom: 2px solid #F1F1F1;
                padding-right: 0.7rem;
                div{
                    &:first-child{
                        font-size: 0.7rem;
                        color: #575757;
                    }
                    &:last-child{
                        display: flex;
                        justify-content: space-between;
                        a{
                            text-decoration: none;
                            color: #FB8E55;
                            font-size: 0.55rem;
                        }
                        img{
                            vertical-align: middle;
                            width: 0.35rem;
                            margin-left: 0.5rem;
                        }
                    }
                }
            }
        }
    }
}


//系统设置
.system{
    width: 100%;
    padding-left: 0.7rem;
    margin-top: 0.6rem;
    background: #FFFFFF;
    border-top: 2px solid #E7E7E7;
    border-bottom: 2px solid #E7E7E7;
    height: 1.875rem;
    line-height: 1.875rem;
    display: flex;
    justify-content: space-between;
    .system-l{
        img{
            width: 1.1rem;
            height: 1.1rem;
        }
    }
    .system-r{
        width: 12.75rem;
        display: flex;
        justify-content: space-between;
        padding-right: 0.7rem;
        div{
            &:first-child{
                font-size: 0.7rem;
                color: #575757;
            }
            &:last-child{
                display: flex;
                justify-content: space-between;
                a{
                    text-decoration: none;
                    color: #FB8E55;
                    font-size: 0.55rem;
                }
                img{
                    vertical-align: middle;
                    width: 0.35rem;
                    margin-left: 0.5rem;
                }
            }
        }
    }
}
